{extend name="base" /}
{block name="title"}创建我的圈子|程序员圈子,技术交流,问题解答,吹水聊天|程序员的收藏夹-专注于程序员学习、分享{/block}

{block name="style"}
	<style type="text/css">
		.iceUpload-img{
			border: none !important;
		}
		.iceUpload-img .iceUpload-info {
			width: 80px;
		    height: 80px;
		}
		.iceUpload-img .iceUpload-info img{
			object-fit: cover;
		    width: 80px;
		    height: 80px;
		}
	</style>
{/block}

{block name="header"}
	{include file="public/user_header" /}
{/block}

{block name="content"}
<template class="iceView">
<div class="zbd-content">
	<div class="page mt15">
		<div class="w-2 w8">
			<div class="box1 yy">
				<div class="title-l fon14">编辑我的圈子</div>
				<div class="box-content">
					<div class="profile">
						<form id="formData" id="auth_type_no">

							<div class="group-form">
							    <div class="group-label">圈子图片</div>
							    <div class="iceUpload-single" data-img="true" data-name="file" data-url="/Upload/uploadPic" data-success="imgSuccess1" >
								    <img i-if="{{type_pic}}" i-src="{{type_pic}}" style="width: 60px;height: 60px;border-radius: 10px; padding: 2px;">
								    <div class="btn min icon ice-upload"> 上传</div>
								</div>
							</div>

							<div class="group-form mt30">
				                <div class="group-label">圈子名称</div>
				                <div class="group-content w5">
				                    <input type="text" class="form-control" i-model="type_name" placeholder="请输入圈子名称">
				                    <small class="help">15个中文字符以内</small>
				                </div>
				            </div>

				            <div class="group-form mt20">
				                <div class="group-label">圈子标签</div>
				                <div class="group-content w5">
				                    <input type="text" class="form-control"  i-model="type_tags" placeholder="请输入圈子标签">
				                    <small class="help">多个标签请用英文逗号','隔开</small>
				                </div>
				            </div>

				            <div class="group-form mt30">
				                <div class="group-label">圈子简介</div>
				                <div class="group-content w5">
				                    <textarea class="form-control resize-none"  i-model="type_desc" placeholder="请输入圈子简介"></textarea>
				                    <small class="help">默认截取100字做为简介</small>
				                </div>
				            </div>

				            <div class="group-form mt20">
				                <div class="group-label">圈子状态</div>
				                <div class="group-value w5">
				                    <div class="radio">
				                        <input type="radio" name="type_status" id="type_status-1" i-model="type_status" value="1">
				                        <label for="type_status-1">开启</label>
				                    </div>
				                    <div class="radio">
				                        <input type="radio" name="type_status" id="type_status-2" i-model="type_status" value="0">
				                        <label for="type_status-2">关闭</label>
				                    </div>

				                </div>
				            </div>

				            <div class="group-form mt20">
				                <div class="group-label">圈子类型</div>
				                <div class="group-value w5">
				                    <div class="radio">
				                        <input type="radio" name="d2" id="d1-2" value="1" checked="">
				                        <label for="d1-2">公开圈子</label>
				                    </div>
				                    <div class="radio">
				                        <input type="radio" name="d2" id="d2-2" value="2" disabled>
				                        <label for="d2-2">私密圈子</label>
				                    </div>
				                </div>
				            </div>

							<div class="group-form mt40">
							    <div class="group-label"></div>
							    <div class="group-content">
							        <button type="button" i-onclick="Save" class="btn bg-black btn-ani btn-shadow"><span>更新信息<i></i></span></button>
							    </div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<input type="hidden" id="type_pic">
<input type="hidden" id="id" value="{$param['id']}">
<input type="hidden" id="type_ids" value="{$param['type_ids']}">
</template>
<script src="/static/web/zbdui/src/view/iceView.js"></script>
<script type="text/javascript">

	// 上传成功的图片
    function imgSuccess1(e,list){
        ice("#type_pic").val(e.url)
    }

    ice.view({
    	id:'',
    	type_name:'',
    	type_pic:'',
    	type_desc:'',
    	type_status: 1,
    	type_class: 1,
    	type_tags:'',
    	Save: function(e) {
    		// 保存
    		var that = this
    		var maps = {
    			'id' : that.id,
    			'type_pic' : ice("#type_pic").val(),
    			'type_name' : that.type_name,
    			'type_desc' : that.type_desc,
    			'type_status' : that.type_status,
    			'type_class' : that.type_class,
    			'type_tags' : that.type_tags,
    		}

    		ice.ajax({
			    url:'/AjaxSyn/circleEdit',
			    type:'post',
			    data:maps,
			    success:function(res){
			        if(res.code == 1){
			        	if(res.message=='请先登录'){
			        		ShowLogin();
			        		return false;
			        	}
			            ice.pop({content:res.message,icon:'fail'})
			            return false;
			        }else{
			        	ice.pop({content:res.message,icon:'success'})
			        	setTimeout(function() {
			        		ice.jump('/bbs/circle?id='+that.id)
			        	}, 1000 )
			        }
			    }
			});
    	},
    	onload: function(){
    		var that = this

    		ice.ajax({
			    url:'/bbs/circle_edit',
			    type:'post',
			    data:{
			    	'id' :ice("#id").val(),
			    	'type_ids' :ice("#type_ids").val(),
			    },
			    success:function(res){
			        console.log(res)
			        if(res.code == 0){
			        	ice("#type_pic").val(res.data.type_pic)
			        	that.set({
			                id:res.data.id,
			                type_pic:res.data.type_pic,
			                type_class:res.data.type_class,
			                type_desc:res.data.type_desc,
			                type_name:res.data.type_name,
			                type_status:res.data.type_status,
			                type_tags:res.data.type_tags,
			            })
			        }
			    }
			});
    		
    	}
    })
</script>
{/block}